import $Util from '@/common/util';

//    index.js中的 state:{},mutations:{}都存放在这里
// 创建商品的状态、方法、字段都存储在这里


export default {
    namespaced: true,  // 必须添加这行来启用命名空间
    state: {

        // ceshi:'测试的vuex控制语句',
        skus_type: 0,//商品规格

        title: '',
        categorg: [],
        desc: '',
        unit: '',
        stock: 0,
        min_stock: 0,
        display_stock: '',
        status: '',
        express: '',

        banners: [{
            id: 1,
            url: require('@/assets/pic.jpg'),
        }],//存储商品大图

        oprice: 0,//市场价格
        pprice: 0,//销售价格
        cprice: 0,//成本价格
        weight: 0,//重量
        volume: 0,//体积

        // 商品规格卡片，增加规格值
        sku_card: [
            // {
            //     name: '规格卡片1',
            //     type: 0,//规格类型 0无 1颜色 2图片
            //     list: [{
            //         name: '黄色',
            //         image: '',
            //         color: '',
            //     }, {
            //         name: '红色',
            //         image: '',
            //         color: '',
            //     }],
            // }
        ],
        // 商品类型
        goods_type_id: "",
        // 商品属性
        goods_attrs: {
            phone_model: "",
        },
        // 折扣
        discount: 0,

        // 表格表头数组
        ths: [
            { name: '商品规格', rowspan: 1, colspan: 1, width: '' },
            { name: 'sku图片', rowspan: 2, width: '60' },
            { name: '销售价', rowspan: 2, width: '100' },
            { name: '市场价', rowspan: 2, width: '100' },
            { name: '成本价', rowspan: 2, width: '100' },
            { name: '库存', rowspan: 2, width: '100' },
            { name: '体积', rowspan: 2, width: '100' },
            { name: '重量', rowspan: 2, width: '100' },
            { name: '编码', rowspan: 2, width: '100' },
        ],

        content: '', // 商品详情富文本内容
    },
    getters: {
        // 只有当添加卡片之后，卡片内是有属性的才会在表格中新增
        skuLabels(state) {
            return state.sku_card.filter(v => Array.isArray(v.list) && v.list.length > 0)
            // (v => {
            //     return v.list.length > 0
            // })

        },
        // colspan是需要动态计算的
        tableThs(state, getters) {
            let length = getters.skuLabels.length;
            state.ths[0].colspan = length;
            // 卡片不为空，则占一行，否则占两行
            state.ths[0].rowspan = length > 0 ? 1 : 2;
            return state.ths;
        },
        // 获取规格表格数据
        tableData(state) {
            // 当前是否有规格卡片
            if (state.sku_card.length === 0) {
                // 没有的话返回空数组
                return [];
            }
            let sku_list = [];
            for (var i = 0; i < state.sku_card.length; i++) {
                // if (state.sku_card[i].list.length > 0) {
                if (Array.isArray(state.sku_card[i].list) && state.sku_card[i].list.length > 0) {
                    sku_list.push(state.sku_card[i].list);
                }
            }
            // 没有组合出来，就返回空数组
            if (sku_list.length === 0) {
                return [];
            }

            // 处理多个规格的情况
            let arr = $Util.cartesianProductOf(...sku_list);
            return arr.map(v => {
                let obj = {
                    skus: [],
                    image: "",//sku图片
                    pprice: 0,//销售价格
                    oprice: 0,//市场价格
                    cprice: 0,//成本价格
                    stock: 0,
                    volume: 0,//体积
                    weight: 0,//重量
                    code: ''
                }
                obj.skus = v;
                return obj;
            })
        },
    },
    mutations: {
        // 修改state方法二
        vModelState(state, { key, value }) {
            state[key] = value;
        },
        // 增加规格卡片
        // addSkuCard(state) {
        //     state.sku_card.push({
        //         name: '规格名称',
        //         type: 0,
        //         list: [],
        //     })
        // },
        addSkuCard(state, data) {
            state.sku_card.push(data)
        },
        // 删除规格卡片
        delSkuCard(state, index) {
            state.sku_card.splice(index, 1)
        },
        // 修改卡片,修改卡片的索引，修改卡片的哪一项，修改后的value值
        vModelSkuCard(state, { key, index, value }) {
            state.sku_card[index][key] = value;
        },

        // 卡片排序
        sortSkuCard(state, { action, index }) {
            // console.log('调用来');

            // 上移、下移
            $Util[action](state.sku_card, index);
            
            // // 排序后补全 list 字段
            // state.sku_card = state.sku_card.map(card => ({
            //     ...card,
            //     list: Array.isArray(card.list) ? card.list : []
            // }));
        },
        // 增加指定规格卡片的规格属性值
        // addSkuValue(state, index) {
        //     state.sku_card[index].list.push({
        //         text: '新增规格',
        //         image: '',
        //         color: '',
        //     });
        // },
        addSkuValue(state, { index, data }) {
            state.sku_card[index].list.push(data);
        },
        // 删除指定规格卡片的属性
        // cardIndex 规格卡片索引
        // valueIndex 规格属性的索引
        delSkuValue(state, { cardIndex, valueIndex }) {
            state.sku_card[cardIndex].list.splice(valueIndex, 1)
        },
        // 修改指定规格卡片的规格属性
        // key 修改的属性
        // value 修改后的值
        updateSkuValue(state, { cardIndex, valueIndex, key, value }) {
            state.sku_card[cardIndex].list[valueIndex][key] = value
        },
        // 排序规格卡片的规格属性列表,使用到拖拽排序，排序完成后更新list中的内容
        // index是哪一个卡片修改了，value修改后的数组传递过来
        sortSkuValue(state, { index, value }) {
            state.sku_card[index].list = value;
        },
        // 修改商品详情富文本内容
        updateContent(state, content) {
            state.content = content
        },
        // 修改商品属性，手机型号
        vModelGoodsAttrs(state, { key, value }) {
            state.goods_attrs[key] = value;
        },
    },
    actions: {

    }
}